import {h, ref} from 'vue';
import { cloneDeep } from 'lodash-es';
import { FormSchema } from '@/components/Form';
import { defRangeShortcuts } from '@/utils/dateUtil';
import { Dicts } from '@/api/dict/dict';
import { Option, getOptionLabel, getOptionTag } from '@/utils/hotgo';
import {isNullObject} from "@/utils/is";
import {NEllipsis, NIcon, NTag, NTooltip} from "naive-ui";
import {QuestionCircleOutlined} from "@vicons/antd";

export class State {
  public id = 0; // id
  public orderSn = ''; // 订单编号
  public outOrderSn = ''; // 三方订单号
  public memberId = 0; // 用户ID
  public restaurantId = 0; // 餐厅ID
  public restaurantDetail = {
    name: ''
  };
  public goodsDetail = {
    goodsName: ''
  };
  public orderAmount = 0; // 订单金额
  public name = ''; // 预定人姓名
  public mobile = ''; // 预定人手机
  public email = ''; // 预定人邮箱
  public bookDate = ''; // 预定日期
  public bookTime = ''; // 预定时间
  public bookingName = '';
  public phoneArea = '';
  public bookingMobile = '';
  public bookingEmail = '';
  public goodsNum = '';
  public bookingCount = '';
  public seatId = 0; // 座位ID
  public payModel = 3; // 1、余额支付 2、组合支付 3、纯外部支付
  public payTime = ''; // 支付时间
  public orderStatus = 'WAIT_PAY'; // 订单付款状态
  public bookingStatus = 'WAIT_CONFIRM'; // 订单预定状态
  public rebateRate = 0; // 分佣比例
  public rebateStatus = 'WAIT'; // WAIT 等待处理佣金   SUCCESS   佣金处理成功    FAIL  佣金处理失败
  public rebateAmount = 0; // 分佣结算金额
  public rebateTime = ''; // 分佣结算时间
  public memberMessage = ''; // 购买人留言信息
  public adultCount = 0; // 成人数量
  public childCount = 0; // 儿童数量
  public infantCount = 0; // 婴儿数量
  public refundStatus = 'WAIT'; // 退款状态   WAIT 未退款   PART  部分退款 DONE 全部退款
  public refundTime = ''; // 退款时间
  public refundAmount = 0; // 已退款金额
  public createdAt = ''; // 创建时间
  public updatedAt = ''; // 更新时间
  public verifyStatus = ''; // 核销状态
  public verifyTime = ''; // 核销时间
  public adminCancelNum = ''; // 后台取消次数

  constructor(state?: Partial<State>) {
    if (state) {
      Object.assign(this, state);
    }
  }
}

export function newState(state: State | Record<string, any> | null): State {
  if (state !== null) {
    if (state instanceof State) {
      return cloneDeep(state);
    }
    return new State(state);
  }
  return new State();
}

// 表单验证规则

// 表格搜索表单
export const schemas = ref<FormSchema[]>([
  {
    field: 'orderSn',
    component: 'NInput',
    label: '预约单号',
    componentProps: {
      placeholder: '请输入预约单号',
      onUpdateValue: (e: any) => {
        console.log(e);
      },
    },
  },
  {
    field: 'restaurantName',
    component: 'NInput',
    label: '餐厅名称',
    componentProps: {
      placeholder: '请输入餐厅名称',
      onUpdateValue: (e: any) => {
        console.log(e);
      },
    },
  },
  {
    field: 'orderStatus',
    component: 'NSelect',
    label: '订单状态',
    defaultValue: 'HAVE_PAID',
    componentProps: {
      placeholder: '请选择订单状态',
      options: [
        {
          label: '已支付',
          value: 'HAVE_PAID'
        },
        {
          label: '待支付',
          value: 'WAIT_PAY'
        },
        {
          label: '已取消',
          value: 'CANCEL'
        },
        {
          label: '全部',
          value: 'ALL'
        },
      ],
      onUpdateValue: (e: any) => {
        console.log(e);
      },
    },
  },
  {
    field: 'bookingStatus',
    component: 'NSelect',
    label: '预约状态',
    defaultValue: 'WAIT_CONFIRM',
    componentProps: {
      placeholder: '请选择预约状态',
      options: [
        {
          label: '待确认',
          value: 'WAIT_CONFIRM'
        },
        {
          label: '已确认',
          value: 'CONFIRMED'
        },
        {
          label: '已取消',
          value: 'CANCEL'
        },
        {
          label: '全部',
          value: 'ALL'
        },
      ],
      onUpdateValue: (e: any) => {
        console.log(e);
      },
    },
  },
  {
    field: 'goodsName',
    component: 'NInput',
    label: '套餐名称',
    componentProps: {
      placeholder: '请输入套餐名称',
      onUpdateValue: (e: any) => {
        console.log(e);
      },
    },
  },
  {
    field: 'createdAt',
    component: 'NDatePicker',
    label: '下单时间',
    componentProps: {
      type: 'datetimerange',
      clearable: true,
      shortcuts: defRangeShortcuts(),
      onUpdateValue: (e: any) => {
        console.log(e);
      },
    },
  },
]);

// 表格列
export const columns = [
  {
    title: '订单信息',
    key: 'id',
    align: 'left',
    width: 250,
    render(row){
      return h(
        'div',
        null,
        [
          h(
            'div',
            null,
            {
              default: () => row.restaurantDetail.name,
            }
          ),
          h(
            'div',
            null,
            {
              default: () => '预订人：' + row.bookingName,
            }
          ),
          h(
            'div',
            null,
            {
              default: () => '预订人电话：' + row.bookingMobile,
            }
          ),
          h(
            'div',
            null,
            {
              default: () => '预订人邮箱：' + row.bookingEmail,
            }
          ),
          h(
            'div',
            null,
            {
              default: () => '人数：' + (row.bookingCount),
            }
          )
        ]
      )
    }
  },
  {
    title: '订单号',
    key: 'orderSn',
    align: 'left',
    width: 200,
  },
  {
    title: '下单时间',
    key: 'createdAt',
    align: 'left',
    width: 180,
  },
  {
    title: '订单状态',
    key: 'orderStatus',
    align: 'left',
    width: 90,
    render(row) {
      if (isNullObject(row.orderStatus)) {
        return ``;
      }
      return h(
        NTag,
        {
          style: {
            marginRight: '6px',
          },
          type: getOptionTag(options.value.order_status, row.orderStatus),
          bordered: false,
        },
        {
          default: () => getOptionLabel(options.value.order_status, row.orderStatus),
        }
      );
    },
  },
  {
    title: '预约状态',
    key: 'bookingStatus',
    align: 'left',
    width: 120,
    render(row) {
      if (isNullObject(row.bookingStatus)) {
        return ``;
      }

      if(row.bookingStatus == "CANCEL"){
        return h(
          'div',
          {
            style: {
              display: 'flex',
              alignItems: 'center'
            },
          },
          [
            h(
              NTag,
              {
                style: {
                  marginRight: '6px',
                },
                type: getOptionTag(options.value.booking_status, row.bookingStatus),
                bordered: false,
              },
              {
                default: () => getOptionLabel(options.value.booking_status, row.bookingStatus),
              }
            ),
            h(
              NTooltip,
              null,
              {
                trigger:()=>
                  h(
                    NIcon,
                    {
                      size: 20,
                      style: {
                        marginLeft: '5px',
                      },
                    },
                    {
                      default: () => h(QuestionCircleOutlined),
                    }
                  ),
                default: () => row.confirmRefuseReason,
              },
            )
          ],
        );
      }
      return h(
        NTag,
        {
          style: {
            marginRight: '6px',
          },
          type: getOptionTag(options.value.booking_status, row.bookingStatus),
          bordered: false,
        },
        {
          default: () => getOptionLabel(options.value.booking_status, row.bookingStatus),
        }
      )
    },
  },
  {
    title: '核销状态',
    key: 'verifyStatus',
    align: 'left',
    width: 100,
    render(row) {
      if (isNullObject(row.verifyStatus)) {
        return ``;
      }
      return h(
        NTag,
        {
          style: {
            marginRight: '6px',
          },
          type: row.verifyStatus == "VERIFIED" ? 'success' : 'warning',
          bordered: false,
        },
        {
          default: () => row.verifyStatus == "VERIFIED" ? '已核销' : '待核销',
        }
      );
    },
  },
  {
    title: '套餐信息',
    key: 'id',
    align: 'left',
    width: 400,
    ellipsis: false,
    render(row){
      return h(
        'div',
        null,
        [
          h(
            'div',
            null,
            {
              default: () => row.goodsDetail.goodsName,
            }
          ),
          h(
            NEllipsis,
            {
              expandTrigger: 'click',
              lineClamp: 2,
              tooltip: false,
            },
            {
              default: () => row.goodsDetail.goodsContent,
            }
          )
        ]
      )
    }
  },
  {
    title: '账款',
    key: 'orderAmount',
    align: 'left',
    width: -1,
    render(row){
      return h(
        'span',
        {
          style: {
            color: 'red',
            fontWeight: 'bold'
          }
        },
        {
          default: () => row.orderAmount + ' JPY'
        }
      )
    }
  },
];

// 字典数据选项
export const options = ref({
  order_status: [] as Option[],
  booking_status: [] as Option[],
});

// 加载字典数据选项
export function loadOptions() {
  Dicts({
    types: ['order_status','booking_status'],
  }).then((res) => {
    options.value = res;
  });
}


